<template>
    <div class="popup-info">
        <!-- <div class="info-box">
            <sectionTitle title="组织引领力评价" />
            <radarChart style="height: calc(100% - 40px)" :chartOptions="chartOptions" />
        </div>
        <div class="info-box">
            <sectionTitle title="业务服务能力评价" />
            <radarChart style="height:calc(100% - 40px)" :chartOptions="chartOptions" />
        </div> -->
        <basicTableComponents :columns="columns" :data="tableData" >
          <template #tooltip="{ row }">
                <el-tooltip :content="row.value" placement="top">
                    {{ row.value }}
                </el-tooltip>
            </template>
        </basicTableComponents>
    </div>
</template>

<script setup lang="ts">
import { ref, defineProps, computed, watch } from 'vue';
import basicTableComponents from '../components/basicTableComponents.vue';
import { currentGET } from "@/api";
import sectionTitle from '../components/sectionTitle.vue';
import radarChart from '../components/radarChart.vue'

const props = defineProps({
    params: {
        type: Object,
        required: false
    },
});
const record = ref([]);
const getData = (params: Object) => {
  console.log(params);
  currentGET("activityView", params).then((res) => {
    console.log(res);
    if (res.success) {
        record.value = res.data;
    }
  });
};
watch(() => props.params, (newVal: Object) => {
    getData(newVal);
}, { immediate: true })

const columns = [
  {
    prop: 'name',
    label: '名称',
    width: '120'
  },
  {
      prop: 'value',
      label: '值',
    //   width: '150'
    height: '300'
  },
];
const tableData = computed(() => {
    return [
        {name: "活动名称", value: record.value.name},
        {name: "活动状态", value: record.value.status},
        {name: "开始时间", value: record.value.startDate},
        {name: "结束时间", value: record.value.endDate},
        {name: "活动内容", value: record.value.content},
        
    ];
})

const chartOptions = ref({
    grid: {
        top: '15%',
        left: 5,
        right: 0,
        bottom: '15%',
        containLabel: true,
    },
    radar: {
        radius: 55
    }
})
</script>

<style scoped lang="less">
.popup-info{
    height: 100%;
    .info-box{
        position: relative;
        height: 50%;
    }
}
</style>